import * as React from "react";
import { Tree, Button, Icon } from "antd";
//
import mvc from "common/mvc";
//
import { BaseView } from "../../base";
import LibraryModel from "../../model/library";

const TreeNode = Tree.TreeNode;
const ButtonGroup = Button.Group;

export default class LibraryComponent extends React.Component<any, any> {
    componentDidMount() {
    }

    buttonClickHandler = (e: React.FormEvent<any>) => {
    }

    render() {
        return (
            <div style={{ width: "100%", height: "100%" }}>
                <Tree
                    >
                    <TreeNode title="parent 1" key="0-0">
                        <TreeNode title="parent 1-0" key="0-0-0">
                            <TreeNode title="leaf" key="0-0-0-0" />
                            <TreeNode title="leaf" key="0-0-0-1" />
                        </TreeNode>
                        <TreeNode title="parent 1-1" key="0-0-1">
                            <TreeNode title={<span style={{ color: '#08c' }}>sss</span>} key="0-0-1-0" />
                        </TreeNode>
                    </TreeNode>
                </Tree>
                <ButtonGroup size="small" >
                    <Button icon="cloud" key="open" onClick={this.buttonClickHandler} />
                    <Button icon="cloud" key="add" onClick={this.buttonClickHandler} />
                    <Button icon="cloud" key="ref" onClick={this.buttonClickHandler} />
                    <Button type="danger" key="del" icon="cloud" onClick={this.buttonClickHandler} />
                </ButtonGroup>
            </div>
        );
    }
}